<template>
    <el-dialog
        v-model="serviceContainerDeployDialogVisible"
        title="容器部署"
        width="20%"
        align-center
        :show-close="false"
        :close-on-click-modal="false"
    >
        是否确定部署该容器？
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="cancelDialog()">取 消</el-button>
                <el-button type="primary" :loading="saveLoading" @click="submitDialog()">
                    确认
                </el-button>
            </div>
        </template>
    </el-dialog>
</template>

<script name="ContainerSimpleDeployDialog" setup lang="ts">
import {containerSimpleDeployInfo} from "@/request/container";
import {ElNotification} from "element-plus";
import {computed, defineProps, ref} from "vue";
import {useServiceContainerStore} from "@/stores/container/container";

let props = defineProps(['containerForm']);

let containerForm = computed(() => {return props['containerForm']});

let saveLoading = ref(false);

let serviceContainerDeployDialogVisible = computed(() => {return useServiceContainerStore().deployDialogVisible});

function cancelDialog() {
    useServiceContainerStore().resetDeployDialogVisible(false);
}

function submitDialog() {
    saveLoading.value = true
    containerSimpleDeployInfo(containerForm.value).then(res => {
        if (res["code"] === '200') {
            ElNotification({
                title: 'Success',
                message: res["message"],
                type: 'success'
            });
            useServiceContainerStore().resetDeployDialogVisible(false);
        }
        saveLoading.value = false
    }).catch(res => {
        saveLoading.value = false
    })
}
</script>

<style scoped>

</style>